<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>帖子管理页面</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/jquery-easyui-1.3.3/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/jquery-easyui-1.3.3/themes/icon.css">
<script type="text/javascript" src="${pageContext.request.contextPath}/static/jquery-easyui-1.3.3/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">

	//编写一个方法，名为reload_daiBanTable，存储绑定到window.top属性中
	window.top["reload_daiBanTable"]=function(){
	    $("#dg").datagrid("reload");
	}

/* formatter="formatTitle"
    function formatTitle(val,row){
        return "&nbsp;<a target='_blank' href='${pageContext.request.contextPath}/article/"+row.id+".html'>"+val+"</a>";
    }
    formatter="formatArcType"
    function formatArcType(val,row){
        return val.typeName;
    } */
    /* val 表示使用这个formatTitle 函数的那个组件的field值 --> [对应当前行的列]  在当前行的值     row 表示当前行的数据 */
    function formatTitle(val,row){
        return "&nbsp;<a target='_blank' href='${pageContext.request.contextPath}/article/"+row.id+".html'>"+val+"</a>";
    }
    function formatArcType(val,row){
        return val.typeName;
    }
    
    function openArticleModifyTab() {
		// selectedRows 是你选择的行的集合， 实质就是json对象数组
		var selectedRows = $("#dg").datagrid("getSelections");
		
		if (selectedRows.length == 0) {
            $.messager.alert("系统提示","请选择要修改的文章（只能选一篇文章进行修改）");
            return ;
        }
		
		if (selectedRows.length != 1) {
			$.messager.alert("系统提示","只能选择一个要修改的文章");
			return ;
		}
		
		var row = selectedRows[0];
		// 打开修改博客的页面 并且传入对应文章的id
		window.parent.openTab("修改博客","modifyArticle.jsp?id="+row.id,"icon-writeArticle");
		
	}
    
    function deleteArticle() {
    	  // selectedRows 是你选择的行的集合， 实质就是json对象数组
        var selectedRows = $("#dg").datagrid("getSelections");
        if (selectedRows.length == 0) {
            $.messager.alert("系统提示","请选择要删除的文章（可选多条）");
            return ;
        }
        var strId = [];
        for (var i = 0; i < selectedRows.length; i++) {
        	strId.push(selectedRows[i].id);
        }
        
        // 把上面的数组以逗号分隔形式合成一个字符串
        var ids = strId.join(",");
        $.messager.confirm("系统提示","您确定要删除这<font color=red>"+selectedRows.length+"</font>条数据吗？",function(r){
        	if (r) { // r表示confirm提示框返回的值  true / false
        		$.post("${pageContext.request.contextPath}/admin/article/delete.do",{ids:ids},function(result){
        			if (result.success) {
        				$.messager.alert("系统提示","数据已完成删除！");
        				$("#dg").datagrid("reload"); // 使用easyUI 重新加载表格数据
        			} else {
        				$.messager.alert("系统提示","数据删除失败！");
        			}
        		},"json");
        	}
        });
	}
    
    function searchArticle(){
        $("#dg").datagrid("load",{ // 调用easyUi的load方法 并传入title参数【参数可以为表格数据中的filed属性的值 filed="title"  ---- 标题】 easyUI  
            "title":$("#s_title").val() // load之后会加载所有标题[因为在easyUi中的表格数据中 标题的field为title ]中包含 $("#s_title").val()  的文章记录
        });
    }

</script>
</head>
<body style="margin: 1px">
<table id="dg" title="帖子管理" toolbar="#tb" class="easyui-datagrid"
fitColumns="true" pagination="true" rownumbers="true"
url="${pageContext.request.contextPath}/admin/article/showArticleList.do" fit="true">
    <thead>
        <tr>
            <th field="cb" checkbox="true" align="center"></th>
            <th field="id" width="20" align="center">编号</th>
            <!-- searchArticle 传入的参数名为 field名  -->
            <th field="title" width="200" align="center" formatter="formatTitle">标题</th>
            <th field="publishDate" width="50" align="center">发布日期</th>
            <th field="arcType" width="50" align="center" formatter="formatArcType" >文章类别</th>
            <th field="click" width="50" align="center">阅读次数</th>
        </tr>
    </thead>
</table>

<div id="tb">
    <div style="float:left;">
        <a href="javascript:openArticleModifyTab()" class="easyui-linkbutton" iconCls="icon-edit" plain="true">修改</a>
        <a href="javascript:deleteArticle()" class="easyui-linkbutton" iconCls="icon-remove" plain="true">删除</a>
    </div>
    <div>
        &nbsp;标题：&nbsp;<input type="text" id="s_title" size="20" onkeydown="if(event.keyCode==13) searchArticle()"/>
        <a href="javascript:searchArticle()" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</a>
    </div>
</div>
</body>
</html>
